import { Component } from 'react';

import '../../../src/index.css'


// 3.创建虚拟dom

// let data = [
//   '1. 开启新的奔赴',
//   '2. 胡新宇家属:遗体在学校后山粮库..',
//   '3. 中疾控：中国本轮疫情已接近尾声'
// ]

// let data2 = [
//   '4. 人气足 市场旺 信心强',
//   '5. 胡新宇母亲：多人曾进粮库寻找过',
//   '6. 什么是 “缢吊”？'
// ]

// let data3 = [
//   {
//     id:1,
//     name:"第一条记事本",
//     wrong:'X'
//   },
//   {
//     id:2,
//     name:"第二条记事本",
//     wrong:'X'
//   },
//   {
//     id:3,
//     name:"第三条记事本",
//     wrong:'X'
//   }
// ]


class list extends Component {
  // constructor(props) {
  //   super(props);
  // }
  state = { 
    li:[0,1,2,3,4,5],
    data:[
      '1. 开启新的奔赴',
      '2. 胡新宇家属:遗体在学校后山粮库..',
      '3. 中疾控：中国本轮疫情已接近尾声',
      '4. 人气足 市场旺 信心强',
      '5. 胡新宇母亲：多人曾进粮库寻找过',
      '6. 什么是 “缢吊”？',
      // '7. 开启新的奔赴',
      // '8. 胡新宇家属:遗体在学校后山粮库..',
      // '9. 中疾控：中国本轮疫情已接近尾声',
      // '10. 人气足 市场旺 信心强',
      // '11. 胡新宇母亲：多人曾进粮库寻找过',
      // '12. 什么是 “缢吊”？'
    ]
   }


  // 换一换
  huanyihuan = ()=>{
    this.setState({
      li:this.state.li.every((item)=>item > 11)
      ? [0,1,2,3,4,5]
      :this.state.li.map((item)=>item+6)
    })
  }



  render() { 
    return ( 
      <>
        <div className='resou'>
          <div className='resou2'>百度热搜 》</div>
          <div className='' onClick={()=>this.huanyihuan()}>换一换</div>
        </div>
        {/* 列表 */}
        <div className='ul'>
            <ul>
              {
                this.state.data.map((item,index)=>{
                  return <li key={index} className='lijfhfh'>{item.name}</li>
                })
              }
              {
                this.props.list.map((item,index)=>{
                  // console.log(item.name);
                  return (
                    <li key={index} className='lijfhfh'>{item.name}</li>
                  )
                })
              }
            </ul>
        </div>
      </>
     );
  }
}
 
export default list;